<template>
  <a-card :bordered="false">
    <h2>数据安全策略设置</h2>
    <a-form
      :form="form"
      :label-col="{ span: 5 }"
      :wrapper-col="{ span: 12 }"
      @submit="handleSubmit"
    >
      <a-form-item label="数据安全备份">
        <a-switch v-decorator="['enabled', { initialValue: dataSecurity.enabled, valuePropName: 'checked' }]" />
      </a-form-item>
      <a-form-item label="备份频率">
        <a-select
          :getPopupContainer="
                triggerNode => {
                  return triggerNode.parentNode || document.body;
                }"
          style="width: 160px;"
          v-decorator="['frequency', { initialValue: dataSecurity.frequency, rules: [{ required: true, message: '请选择备份频率' }] }]"
        >
          <a-select-option value="daily"> 每天 </a-select-option>
          <a-select-option value="weekly"> 每周一 </a-select-option>
          <a-select-option value="monthly"> 每月一号 </a-select-option>
        </a-select>
      </a-form-item>
      <a-form-item label="备份时间">
        <a-time-picker v-decorator="['time', { initialValue: bakTime, rules: [{ required: true, message: '请选择备份时间' }] }]" />
      </a-form-item>
      <a-form-item label="备份策略">
        <a-radio-group v-decorator="['policy', { initialValue: dataSecurity.policy, rules: [{ required: true, message: '请选择备份策略' }] }]">
          <a-radio value="full"> 完全备份 </a-radio>
          <!-- <a-radio value="increment"> 增量备份 </a-radio> -->
        </a-radio-group>
      </a-form-item>
      <a-form-item :wrapper-col="{ span: 12, offset: 5 }">
        <a-button
          type="primary"
          html-type="submit"
        > 提交 </a-button>
      </a-form-item>
    </a-form>
  </a-card>
</template>

<script>
  import { gPostAction } from '@/api/manage'
  import moment from 'moment'

  export default {
    name: 'F010201',
    data() {
      return {
        form: this.$form.createForm(this),
        dataSecurity: {
          frequency: '',
          time: moment('00:00', 'HH:mm:ss'),
          policy: ''
        },
      }
    },
    mounted() {
      this.loadSecurityData()
    },
    computed: {
      bakTime() {
        return moment(this.dataSecurity.time, 'HH:mm:ss')
      }
    },
    methods: {
      loadSecurityData() {
        gPostAction('/dataSecurity/detail', {}).then((res) => {
          if (res.success) {
            this.dataSecurity = res.data;
          }
        })
      },
      handleSubmit(e) {
        e.preventDefault();
        this.form.validateFields(async (err, values) => {
          if (!err) {
            const postData = {
              frequency: values.frequency,
              policy: values.policy,
              enabled: values.enabled,
              time: moment(values.time).format('HH:mm:ss')
            }
            gPostAction('/dataSecurity/set2', postData).then((res) => {
              if (res.success) {
                this.$message.success('提交成功')
              }
            })
          }
        })
      },
    },
  }
</script>